<script setup lang="ts" name="PageFooter"></script>

<template>
    <div class="page-footer bg-black divide-y divide-gray-600/80">
        <div class="flex justify-center gap-x-44 py-16 text-gray-300/85">
            <ul class="flex flex-col gap-y-6">
                <li class="flex items-center gap-x-4">
                    <i class="w-12 h-12 rounded-full bg-gray-400"></i>
                    <strong>公司名称</strong>
                </li>
                <li class="space-x-1">
                    <label>地址:</label>
                    <span>公司地址...</span>
                </li>
                <li class="space-x-1">
                    <label>网址:</label>
                    <span>www.sinlang.com</span>
                </li>
                <li class="space-x-1">
                    <label>电话:</label>
                    <span>(+11) 777453847534</span>
                </li>
            </ul>
            <div class="flex gap-x-32">
                <ul class="flex flex-col gap-y-4">
                    <li>
                        <a href="#">本站简介</a>
                    </li>
                    <li>
                        <a href="#">建站缘由</a>
                    </li>
                    <li>
                        <a href="#">编审说明</a>
                    </li>
                    <li>
                        <a href="#">免责说明</a>
                    </li>
                    <li>
                        <a href="#">版权问题</a>
                    </li>
                </ul>
                <ul class="flex flex-col gap-y-4">
                    <li>
                        <a href="#">本站简介</a>
                    </li>
                    <li>
                        <a href="#">建站缘由</a>
                    </li>
                    <li>
                        <a href="#">编审说明</a>
                    </li>
                    <li>
                        <a href="#">免责说明</a>
                    </li>
                    <li>
                        <a href="#">版权问题</a>
                    </li>
                </ul>
            </div>
            <div class="flex flex-col gap-y-6">
                <span class="block w-20 h-20 rounded-lg bg-white">
                    <img
                        src="@/assets/icons/icon_qr.svg"
                        alt="code"
                    />
                </span>
                <span class="flex gap-x-2 px-2 py-3 bg-slate-800/75">
                    <input
                        class="w-72 bg-transparent focus:outline-none"
                        placeholder="Enter your email address"
                    />
                    <i
                        class="relative -bottom-2 w-7 h-7 bg-[url('@/assets/icons/icon_email.png')] bg-no-repeat bg-contain"
                    ></i>
                </span>
            </div>
        </div>
        <div class="flex flex-col gap-y-3 py-5">
            <ul class="flex justify-center gap-x-6 text-sm text-gray-500">
                <li class="text-[#30C05D]">网站地图</li>
                <li>收藏本站</li>
                <li>分享本站</li>
            </ul>
            <span class="text-center text-sm text-gray-200">
                Copyright©2015-2023 秦皇岛领绣科技有限公司 版权所有
                冀ICP备15010480号-2
            </span>
        </div>
    </div>
</template>

<style scoped></style>
